﻿<UserControl
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
	xmlns:local="clr-namespace:CoreSharp.Controls"
	xmlns:CoreSharp_Keyboard_Converter="clr-namespace:CoreSharp.Keyboard.Converter" xmlns:CoreSharp_Keyboard="clr-namespace:CoreSharp.Keyboard"
	mc:Ignorable="d"
	x:Class="CoreSharp.Controls.KeyboardLayoutViewer"
	d:DesignWidth="480" d:DesignHeight="800" Height="Auto">
	<UserControl.Resources>
		<CoreSharp_Keyboard_Converter:BooleanToClickModeConverter x:Key="BooleanToClickModeConverter"/>
		<CoreSharp_Keyboard:GlobalKeyboardSetting x:Key="GlobalKeyboardSettingDataSource" d:IsDataSource="True"/>
		<Style x:Key="KeyboardButton" TargetType="Button">
			<Setter Property="Background" Value="{StaticResource PhoneInactiveBrush}"/>
			<Setter Property="BorderBrush" Value="{x:Null}"/>
			<Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
			<Setter Property="FontFamily" Value="/CoreSharp.Keyboard;component/Fonts/Fonts.zip#Leelawadee"/>
			<Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/>
			<Setter Property="Padding" Value="0,0,0,0"/>
			<Setter Property="Margin" Value="0,0,0,0"/>
			<Setter Property="Width" Value="42"/>
			<Setter Property="Template">
				<Setter.Value>
					<ControlTemplate TargetType="Button">
						<Canvas Height="140" Margin="0" VerticalAlignment="Bottom" >
							<VisualStateManager.VisualStateGroups>
								<VisualStateGroup x:Name="CommonStates">
									<VisualStateGroup.Transitions>
										<VisualTransition GeneratedDuration="0:0:0.25">
											<VisualTransition.GeneratedEasingFunction>
												<CircleEase EasingMode="EaseOut"/>
											</VisualTransition.GeneratedEasingFunction>
										</VisualTransition>
									</VisualStateGroup.Transitions>
									<VisualState x:Name="Normal">
										<Storyboard>
											<ColorAnimation Duration="0" To="{StaticResource PhoneInactiveColor}" Storyboard.TargetProperty="(Control.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ButtonBackground" d:IsOptimized="True"/>
										</Storyboard>
									</VisualState>
									<VisualState x:Name="MouseOver"/>
									<VisualState x:Name="Pressed">
										<Storyboard>
											<DoubleAnimation Duration="0" To="1.2" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="ClickedButton" d:IsOptimized="True"/>
											<DoubleAnimation Duration="0" To="1.2" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="ClickedButton" d:IsOptimized="True"/>
											<DoubleAnimation Duration="0" To="-18" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="ClickedButton" d:IsOptimized="True"/>
											<DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ClickedButton" d:IsOptimized="True"/>
											<ColorAnimation Duration="0" To="{StaticResource PhoneInverseInactiveColor}" Storyboard.TargetProperty="(Control.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ButtonBackground" d:IsOptimized="True"/>
										</Storyboard>
									</VisualState>
									<VisualState x:Name="Disabled"/>
								</VisualStateGroup>
							</VisualStateManager.VisualStateGroups>
							<Border x:Name="ClickedButton" CornerRadius="0" RenderTransformOrigin="0.5,1" Background="{StaticResource PhoneContrastBackgroundBrush}" Opacity="0" IsHitTestVisible="False" BorderThickness="{StaticResource PhoneBorderThickness}" BorderBrush="{StaticResource PhoneContrastForegroundBrush}" Height="70" Width="53">
								<Border.RenderTransform>
									<CompositeTransform TranslateY="70"/>
								</Border.RenderTransform>
								<ContentControl x:Name="ClickedContent" ContentTemplate="{TemplateBinding ContentTemplate}" Foreground="{StaticResource PhoneContrastForegroundBrush}" FontSize="48" FontWeight="Bold" Content="{TemplateBinding Content}"/>
							</Border>
							<Border x:Name="ButtonBackground" CornerRadius="0" Height="70" VerticalAlignment="Bottom" RenderTransformOrigin="0.5,0.5" Canvas.Left="3" Canvas.Top="68" Width="48">
								<Border.Background>
									<SolidColorBrush Color="{StaticResource PhoneRadioCheckBoxColor}"/>
								</Border.Background>
								<ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" FontSize="29.333">
									<ContentControl.Foreground>
										<SolidColorBrush Color="{StaticResource PhoneForegroundColor}"/>
									</ContentControl.Foreground>
								</ContentControl>
							</Border>
						</Canvas>
					</ControlTemplate>
				</Setter.Value>
			</Setter>
		</Style>
		<ItemsPanelTemplate x:Key="KeyboardRowPanel">
			<StackPanel Orientation="Horizontal"/>
		</ItemsPanelTemplate>
		<DataTemplate x:Key="KeyboardItemTemplate">
			<Button Content="{Binding}" Style="{StaticResource KeyboardButton}" Click="Button_Click" Width="53" FontSize="29.333" CacheMode="BitmapCache" ClickMode="{Binding GlobalSetting.HighSensitivityMode, Converter={StaticResource BooleanToClickModeConverter}, Source={StaticResource GlobalKeyboardSettingDataSource}}"/>
		</DataTemplate>
		<Style x:Key="KeyboardRowStyle" TargetType="ItemsControl">
			<Setter Property="Height" Value="120"/>
			<Setter Property="HorizontalAlignment" Value="Center"/>
			<Setter Property="VerticalAlignment" Value="Top"/>
			<Setter Property="ItemsPanel" Value="{StaticResource KeyboardRowPanel}"/>
			<Setter Property="ItemTemplate" Value="{StaticResource KeyboardItemTemplate}"/>
		</Style>
	</UserControl.Resources>

	<Grid x:Name="LayoutRoot" Margin="0" VerticalAlignment="Top">
		<ItemsControl ItemsSource="{Binding Row1}" Style="{StaticResource KeyboardRowStyle}" Height="140" />
		<ItemsControl ItemsSource="{Binding Row2}" Style="{StaticResource KeyboardRowStyle}" Margin="0,75,0,0" Height="140" />
		<ItemsControl ItemsSource="{Binding Row3}" Style="{StaticResource KeyboardRowStyle}" Margin="0,150,0,0" Height="140" />
		<ItemsControl ItemsSource="{Binding Row4}" Style="{StaticResource KeyboardRowStyle}" Margin="0,225,0,0" Height="140" />
	</Grid>
</UserControl>